<!-- 请假通知-->
<template>
	<view class="mainPge">
		<!-- 公共头部 -->
		<headerPublic title="请假申请" />
		<!--主体-->
		<view class="page-content">
			<!-- 顶部固定 -->
			<view class="tabs">
				<view class="tbrow">
					<view class="tabit" v-for="(it, index) in tabs" :key="it.value" @click="handeltabcheck(it.value)">
						<text class="t1">{{ it.lable }}</text>
						<view class="notice-red" v-if="index==1 && pendingNum!==0">{{pendingNum}}</view>
						<view class="activeli" :class="{ check: tabcheck == it.value }"></view>
					</view>
				</view>
				<!--搜索-->
				<view class="top-search">
					<uv-input v-model="title" placeholder="搜索" class="search-ipt" border="none">
						<template v-slot:prefix>
							<uv-icon name="search" size="24" color="#999" @click="$refs.paging.reload()"></uv-icon>
						</template>
					</uv-input>
				</view>
			</view>
			<!-- 列表-->
			<z-paging :fixed="false" style="height: 81vh" ref="paging" v-model="list" @query="querylist" :auto="false">
				<!-- 我申请的-->
				<view class="Plist" v-if="tabcheck == 2">
					<view class="Pitme" v-for="(item, index) in list" :key="index">
						<view class="pstatus">
							<!-- b1红色  b2 黄色  b3 绿色  没有就是默认灰色-->
							<text class="str" :class="{
                                    'b2': ['UNDO', 'AUDIT'].includes(item.businessStatus),
                                    'b3': ['DONE', 'AUDITED', 'FINISH'].includes(item.businessStatus)
                                }"
								v-if="['UNDO', 'AUDIT', 'DRAFT', 'REBACK', 'DONE', 'AUDITED', 'FINISH'].includes(item.businessStatus)">
								{{item.businessStatusName}}
							</text>
						</view>
						<text class="ptitle">{{ item.holidayTypeName }}</text>
						<view class="pt-row">
							<view class="ptit">
								<text class="t1">创建部门：</text>
								<text class="t2">{{ item.deptName }}</text>
							</view>
							<view class="ptit">
								<text class="t1">创建人：</text>
								<text class="t2">{{ item.agentName }}</text>
							</view>
						</view>
						<view class="pt-row">
							<view class="ptit">
								<text class="t1">创建日期：</text>
								<text class="t2">{{ item.createTime }}</text>
							</view>
						</view>
						<view class="line"></view>
						<view class="pt-row rowflexend">
							<view class="pt-row bts">
								<view class="bt bt-type1"
									v-if="item.businessStatus == 'UNDO'||item.businessStatus == 'AUDIT'"
									@click="$refs.modal.open();businessId = item.businessId">撤回</view>
								<view class="bt bt-type1" @click="goinfopage(item)"
									v-if="item.businessStatus == 'UNDO' || item.businessStatus == 'FINISH' || item.businessStatus == 'DONE'|| item.businessStatus == 'AUDIT'">
									查看详情
								</view>
								<view class="bt bt-type2"
									v-if="item.businessStatus == 'AUDITED' || item.businessStatus == 'DRAFT' || item.businessStatus == 'REBACK'"
									@click="ljbnfn(item)">
									立即办理
								</view>
							</view>
						</view>
					</view>
				</view>
				<!-- 待处理的和已办的-->
				<view class="Plist" v-if="tabcheck == 1 || tabcheck == 3">
					<view class="Pitme" v-for="(item, index) in list" :key="index">
						<view class="pstatus">
							<view class="pstatus">
								<!-- b1红色  b2 黄色  b3 绿色  没有就是默认灰色-->
								<text class="str b1"
									:class="{'b1':item.status == 'DRAFT','b2':item.status == 'UNDO','b3':item.status == 'DONE'}">{{item.statusName}}</text>
							</view>
						</view>
						<text class="ptitle">{{ item.holidayTypeName }}</text>
						<view class="pt-row">
							<view class="ptit">
								<text class="t1">创建部门：</text>
								<text class="t2">{{ item.deptName }}</text>
							</view>
							<view class="ptit">
								<text class="t1">创建人：</text>
								<text class="t2">{{ item.agentName }}</text>
							</view>
						</view>
						<view class="pt-row">
							<view class="ptit">
								<text class="t1"> 日期：</text>
								<text class="t2">{{ item.createTime }}</text>
							</view>
						</view>
						<view class="line"></view>
						<view class="pt-row rowflexend">
							<view class="pt-row bts">
								<view class="bt bt-type1" @click="goinfopage(item)"
									v-if="item.status == 'DONE' || item.status == 'REBACK'">
									查看详情
								</view>
								<view class="bt bt-type2" v-if=" item.status== 'DRAFT'|| item.status == 'UNDO'"
									@click="ljbnfn(item)">
									立即办理
								</view>
							</view>
						</view>
					</view>
				</view>
			</z-paging>
			<!-- 新建按钮 -->
			<view class="newadd" @click="addnewfn">新建</view>
		</view>
		<!-- 二次确认提示消息框-->
		<uv-modal ref="modal" title="提示" content="您是否确认撤回?" @confirm="handelreback" :showCancelButton="true"
			cancelColor="#2D75D7" align="center"></uv-modal>
	</view>
</template>

<script>
	import {
		getICreatList,
		getIapproveList,
		getNoticeList,
		creatReback,
		setReadstauts
	} from '@/api/applicationleave.js';
	import {
		getreadNum
	} from '@/api/common.js';
	export default {
		name: 'header',
		data() {
			return {
				list: [],
				title: '',
				tabcheck: 2,
				pageSize: 10,
				pageNumber: 1,
				tabs: [{
						lable: '我申请的',
						value: 2
					}, {
						lable: '待处理的',
						value: 1
					},
					{
						lable: '我已办的',
						value: 3
					}
				],
				businessId: '',
				pendingNum: 0, // 待处理角标数
				timer: null // 定时器管理器实例
			};
		},
		onLoad(res) {
			this.tabcheck = res && res.tabtype ? parseInt(res.tabtype) : 2;
			// 首次加载时调用一次
			this.updateReadNum();
		},
		onShow() {
			this.list = []
			this.pageNumber = 1
			this.getList()
			this.startReadNumTimer()
		},
		onHide() {
			this.clearReadNumTimer()
		},
		onUnload() {
			this.clearReadNumTimer()
		},
		methods: {
			// 更新待处理数量
			updateReadNum() {
				getreadNum().then(res => {
					if (res.code == 200 && res.data) {
						this.pendingNum = res.data["UN_HANDLE_COUNT_HOLIDAY"]?.count || 0;
					}
				}).catch(error => {
					this.clearReadNumTimer();
				});
			},
			startReadNumTimer() {
				// 清除可能存在的定时器
				this.clearReadNumTimer()
				// 设置新的定时器
				this.timer = setInterval(() => {
					this.updateReadNum()
				}, 3000)
			},
			// 清除定时器方法
			clearReadNumTimer() {
				if (this.timer) {
					clearInterval(this.timer)
					this.timer = null
				}
			},
			// 我创建的撤回
			handelreback() {
				creatReback({
					id: this.businessId
				}).then(res => {
					this.$refs.paging.reload();
				})
			},
			// 通知公告---立即查看
			ljkook(it) {
				//通知公告---立即查看
				if (this.tabcheck == 1) {
					setReadstauts({
						noticeId: it.id
					})
					uni.navigateTo({
						url: '/documentManagement/applicationleave/conduct?tabtype=notice&businessId=' + it
							.businessId + '&businessType=' + it.businessType + '&id=' + it.id
					});

				}
			},
			// 立即办理
			ljbnfn(it) {
				//我发起---立即办理
				if (this.tabcheck == 2) {
					// 已审批 跳16
					if (it.businessStatus == 'DRAFT' || it.businessStatus == 'REBACK') {
						uni.navigateTo({
							url: '/documentManagement/applicationleave/infoset?tabtype=icreat&actionType=edit&businessId=' +
								it.businessId +
								'&businessType=' +
								it.businessType +
								'&businessStatus=' +
								it.businessStatus
						});
					}
					if (it.businessStatus == 'AUDITED') {
						uni.navigateTo({
							url: '/documentManagement/applicationleave/conduct?tabtype=icreat&businessId=' + it
								.businessId + '&businessType=' + it.businessType
						});
					}
				}
				// 待处理-立即办理
				if (this.tabcheck == 1) {
					uni.navigateTo({
						url: '/documentManagement/applicationleave/conduct?tabtype=iapprove&businessId=' + it
							.businessId + '&businessType=' + it.businessType + '&id=' + it.id
					});
				}
			},
			// 查看详情
			goinfopage(it) {
				//我创建的---查看详情
				if (this.tabcheck == 2) {
					uni.navigateTo({
						url: '/documentManagement/applicationleave/conduct?tabtype=icreat&businessId=' + it
							.businessId + '&businessType=' + it.businessType
					});
				}
				// 我审批的--查看详情
				if (this.tabcheck == 3) {
					uni.navigateTo({
						url: '/documentManagement/applicationleave/conduct?tabtype=iapprove&businessId=' + it
							.businessId + '&businessType=' + it.businessType + '&id=' + it.id +
							'&actiontype=seeinfo'
					});
				}
			},
			// tab切换
			handeltabcheck(value) {
				this.tabcheck = value;
				this.list = []
				this.$refs.paging.reload();
			},
			// 获取页面列表数据
			getList(pageNum) {
				let querydata = {
					pageNumber: this.pageNumber,
					pageSize: this.pageSize,
					title: this.title,
					handleState: this.tabcheck === 1 ? 0 : this.tabcheck === 3 ? 1 : '',
				};
				if (this.tabcheck == 1) {
					getNoticeList(querydata).then((res) => {
						this.setPagelist(res);
					});
				}
				if (this.tabcheck == 2) {
					getICreatList(querydata).then((res) => {
						this.setPagelist(res);
					});
				}
				if (this.tabcheck == 3) {
					getIapproveList(querydata).then((res) => {
						this.setPagelist(res);
					});
				}
			},
			setPagelist(res) {
				if (res.data !== [] && res.code == 200) {
					this.$refs.paging.complete(res.data.records);
				}
			},
			// 立即办理
			goljbl() {
				uni.navigateTo({
					url: '/documentManagement/applicationleave/conduct'
				});
			},
			// 新建
			addnewfn() {
				uni.navigateTo({
					url: '/documentManagement/applicationleave/infoset'
				});
			},
			querylist(page, size) {
				this.pageSize = size;
				this.pageNumber = page;
				this.getList();
			},
			// 返回上一层
			backfn() {
				uni.navigateBack();
			}
		}
	};
</script>

<style scoped lang="scss">
	@import '../../style/documentmanage.scss';
</style>